// ***********************点击切换登录******************************************************
$('.login a').on('click', function () {
  $('.login').hide().next().show();
});
$('.register a').on('click', function () {
  $('.login').show().next().hide();
})

// ********************完成注册功能*******************************************************************
// 表单提交，阻止默认行为，收集用户名、密码，ajax提交给注册接口
// 一定要检查表单项的name属性，是否和接口要求的请求参数一致
$('.register form').on('submit', function (el) {
  el.preventDefault(); //阻止默认事件 表单的默认提交事件
  // 收集账号密码；serialize() 方法根据表单元素的name属性收集值
  var data = $(this).serialize();
  // 提交接口
  $.ajax({
    type: 'post',
    url: '/api/reguser',
    data: data,
    success: function (res) {
      layer.msg(res.message); //插件的提示层
      // 判断是否提交成功成功就  切换到登录页面  重置输入框 变为空的 
      if (res.status === 0) {
        $('.login').show().next().hide(); //切换页面
        $('.register form')[0].reset(); // reset()是DOM的方法  [0]是把JQ对象转为DOM对象
      }
    }
  })
})
// *******************************完成注册的表单验证规则*************************************
//我们使用了 layui 的内置模块 - form；
// 使用layui的内置模块，必须先加载模块；加载的语法 let 变量 = layui.模块名;
let form = layui.form;
// 使用自定的表单验证属性
form.verify({
  // 键（验证规则）：值（验证方法（数组/函数））
  // length: ['正则表达式', '验证不通过时的提示信息']
  length: [/^\S{6,12}$/, '请输入6-12位密码'], //正则表示/^$/精确匹配 \s 空格 6至12位
  yiyang: function (val) {
    // 形参表示使用该验证规则的输入框的值。目前，确认密码使用了这个验证规则；所以形参val表示输入的确认密码
    var pas = $('.reg-pwd').val();  //找出密码框的值和 确认密码的值相比较
    if (val !== pas) {
      // 验证不通过后的信息
      return '我们不一样'
    }
  }
})
// *******************************完成登录功能*************************************
$('.login form').on('submit', function (e) {
  e.preventDefault();
  $.ajax({
    type: 'post',
    url: '/api/login',
    data: $(this).serialize(),
    success: function (res) {
      layer.msg(res.message);
      if (res.status === 0) {
        // 把token 保存在本地存储
        localStorage.setItem('token', res.token)
        location.href = '/index.html'
      }
    }
  })
})